<template>
  <div class="maintooling">
    <!-- <eHeader @doSearch="doSearch" /> -->
    <el-row style="paddingBottom: 0">
      <el-col :span="24">
        <dynForm :info-form="searchForm" :search-tags="searchTags" label-width="120px">
          <el-button
            type="primary"
            icon="el-icon-search"
            @click="doSearch">
            {{ $t("search") }}
          </el-button>
        </dynForm>
      </el-col>
    </el-row>
    <!-- 主体部分 -->
    <el-card shadow="never">
      <!-- 表单部分 -->
      <el-row>
        <dynTable
          ref="dynTable"
          :loading="tableLoading"
          :table-data="tableData"
          :table-columns="tableColumns"
        />
      </el-row>
      <!--分页组件-->
      <pagination
        :total="total"
        :page.sync="listQuery.page"
        :size.sync="listQuery.size"
        @pagination="getList"
      />
    </el-card>
  </div>
</template>
<script>
import crudJob from '@/api/Tooling/toolingMaintain'
import eHeader from './module/header'
import mySetting from '@/mixins/mySetting'
export default {
  name: 'ToolingMaintainPage',
  components: { eHeader },
  mixins: [mySetting],
  // 数据字典
  data() {
    return {
      multipleSelection: [],
      title: '', // 弹窗标题
      searchForm: {},
      searchTags: [
        { label: this.$t('toolingBarcode'), prop: 'toolingBarcode', tag: 'DynInput' }
      ],
      tableLoading: true,
      tableColumns: [
        { prop: '', label: this.$t('index'), type: 'index', width: '50px', templete: (_scope) => {
          return (
            <span>{ (this.listQuery.page - 1) * this.listQuery.size + _scope.$index + 1 }</span>
          )
        } },
        {
          prop: 'toolingBarcode',
          label: this.$t('toolingBarcode'),
          width: '100px'
        },
        {
          prop: 'systemTime',
          label: this.$t('maintainTime')
        },
        {
          prop: 'repairId',
          label: this.$t('repairId'),
          width: '120px'
        },
        {
          prop: 'repairPart',
          label: this.$t('repairPart'),
          width: '120px'
        },
        {
          prop: 'repairReason',
          label: this.$t('repairReason'),
          width: '100px'
        },
        {
          prop: 'repairMode',
          label: this.$t('repairMode'),
          width: '100px'
        },
        {
          prop: 'cleanId',
          label: this.$t('cleanId'),
          width: '120px'
        },
        {
          prop: 'cleanPart',
          label: this.$t('cleanPart'),
          width: '100px'
        },
        {
          prop: 'cleanReason',
          label: this.$t('clearReason'),
          width: '100px'
        },
        {
          prop: 'cleanMode',
          label: this.$t('clearMode'),
          width: '100px'
        },
        {
          prop: 'eqpId',
          label: this.$t('eqpName'),
          width: '100px'
        },
        // {
        //   prop: 'maintainUsedTime',
        //   label: this.$t('maintainUsedTime')
        // },
        // {
        //   prop: 'resetFlag',
        //   label: this.$t('resetFlag')
        // },
        { prop: 'resetFlag', label: this.$t('resetFlag'), templete: (_scope) => {
          return (
            <el-switch
              v-model={_scope.row.resetFlag}
              active-value={1}
              inactive-value={0}
              active-color={'#13ce66'}
              inactive-color={'#ff4949'}
              disabled/>
          )
        }, width: '100px' }
        // {
        //   prop: 'remark',
        //   label: this.$t('remark')
        // }
      ]
    }
  },
  created() {
    this.initList()
  },
  methods: {
    // 切换分页
    getList(page) {
      this.tableLoading = true
      this.listQuery = page
      this.initList()
    },
    // 初始化列表
    initList() {
      crudJob.getList(this.$clearNull({ ...this.listQuery, ...this.searchForm })).then(res => {
        this.tableData = res.data
        this.total = res.total
        this.tableLoading = false
      })
    },
    // 点击查询
    doSearch(val) {
      this.listQuery.page = 1
      this.initList()
    }
  }
}
</script>
<style lang="scss" scoped>
@import "~@/assets/styles/defaultStyle.scss";
</style>
